<template>
  <div>
    <Card>
      <span slot="title">
        订单统计
      </span>
      <div slot="title1">
<div>时间范围
            <!-- 引入时间 -->
           <el-date-picker
     
     
      type="datetimerange"
      range-separator="至"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
      align="right">
    </el-date-picker>
    <el-button style="margin-left:10px" type="primary">查询</el-button>
</div>
    <Charts v-if="isshow" :option="option" />
    <!-- 引入echarts -->

      </div>
    </Card>
  </div>
</template>

<script>
import moment from "moment"
//  <!-- 引入echarts -->
import Card from "@/components/Card.vue"

import Charts from "@/components/Charts.vue"

import {apiecharts2_js} from "@/apis/Echarts.js"



  export default {
    components:{
      Card,
      Charts,
    },
    data(){
      return{
        option:{
          text: "商品统计",
          xData:'',
          orderTime:'',
          type:"bar",
            title:{
            name1:'订单数据',
            name2:"订单金额"
          }
        }
        ,isshow:false
      }
    },
    //进来就床架ajax
    async created(){
      let {data} = await apiecharts2_js({
        date:"[]",
      })


      this.option.orderData = data.map(item=> item.orderAmount)
      this.option.xData = data.map(item=>item.orderTime = moment(item.orderTime).format("YYYY-MM-DD"))
      this.isshow = true
      console.log("我是先发送的");
    },

  }
</script>

<style lang="less" scoped>

</style>